
<%@ page import="dao.UserDao" %>
<%@ page import="entity.UserEnity" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%
    request.setCharacterEncoding("UTF-8");
    UserEnity user = null;
    UserDao userDao = new UserDao();
    user = userDao.getOneUser(); // 假设存在getOneUser方法来获取单个用户信息
    session.setAttribute("user", user);
%>
<!DOCTYPE html>
<html>
<head>
    <title>修改用户信息</title>
    <script src="../static/js/bootstrap.bundle.min.js"></script>
    <script src="../static/js/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <link rel="stylesheet" href="../static/css/bootstrap.min.css">
    <script>
        function updateUser() {
            var id = document.getElementById('id').value;
            var name = document.getElementById('name').value;
            var age = document.getElementById('age').value;
            var statue = document.getElementById('statue').value;
            var gender = document.getElementById('gender').value;
            var phone = document.getElementById('phone').value;

            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/updateUser', true);
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    if (xhr.responseText === 'true') {
                        showSuccess('SUCCESS！', '修改用户信息成功');
                    } else {
                        showError('ERROR！', '修改用户信息失败');
                    }
                }
            };
            var data = 'id=' + id + '&name=' + encodeURIComponent(name) + '&age=' + age + '&statue=' + encodeURIComponent(statue) + '&gender=' + encodeURIComponent(gender) + '&phone=' + encodeURIComponent(phone);
            xhr.send(data);
        }
        function showSuccess(title, text = '', timer = 1000) {
            Swal.fire({
                icon:'success',
                title: title,
                text: text,
                timer: timer,
                showConfirmButton: false,
                toast: true,
                position: 'top-center',
            });
        }

        function showError(title, text = '', timer = 1000) {
            Swal.fire({
                icon: 'error',
                title: title,
                text: text,
                timer: timer || undefined,
                showConfirmButton:!!timer,
            });
        }
    </script>
</head>
<body>
<iframe src="../Userframe/top.html" frameborder="0" style="width: 100%; height: 100px;"></iframe>
<div class="container" style="margin:30px auto;border-radius: 8px;height: 700px;align-items: center;display:flex;justify-content: center">
    <form class="row g-3">
        <div class="col-md-12 mb-3">
            <label for="id" class="form-label">ID</label>
            <input type="text" class="form-control" id="id" readonly value="<%=user.getId()  %>" name="id">
        </div>
        <div class="col-md-12 mb-3">
            <label for="name" class="form-label">姓名</label>
            <input type="text" class="form-control" id="name" value="<%=user.getName()%>" name="name">
        </div>
        <div class="col-md-12 mb-3">
            <label for="age" class="form-label">年龄</label>
            <input type="number" class="form-control" id="age" value="<%=user.getAge()%>" name="age">
        </div>
        <div class="col-md-12 mb-3">
            <label for="statue" class="form-label">状态</label>
            <input type="text" class="form-control" id="statue" value="<%=user.getStatue()%>" name="statue">
        </div>
        <div class="col-md-12 mb-3">
            <label for="gender" class="form-label">性别</label>
            <input type="text" class="form-control" id="gender" value="<%=user.getGender()%>" name="gender">
        </div>
        <div class="col-md-12 mb-3">
            <label for="phone" class="form-label">电话</label>
            <input type="text" class="form-control" id="phone" value="<%=user.getPhone()%>" name="phone">
        </div>
        <div class="col-md-12">
            <button type="button" class="btn btn-primary" style="margin-top:30px;justify-content: center" onclick="updateUser()">提交修改</button>
        </div>
    </form>
</div>
</body>
</html>